@import 'common.sass'

.banner-container
    width: vw(750)
    height: vw(250)
    background-image: url("images/news/banner.png")
    background-size: vw(750) vw(250)
    background-position: center center

.news-title
    width: auto
    height: auto
    display: flex
    flex-direction: column
    align-items: center

    .english
        font-size: vw(18)
        color: $content_color

    .chinese
        font-size: vw(28)
        color: $title_color

#hair-losing-reason-container
    width: vw(750)
    height: auto
    display: flex
    flex-direction: column
    justify-content: center
    align-items: center

    .swiper-wrapper
        width: vw(750)
        height: vw(370)

        .swiper-slide
            width: vw(700)
            height: vw(370)
            display: flex
            justify-content: center

            .content-box
                width: vw(700)
                height: vw(370)
                display: flex
                justify-content: space-between
                align-items: center
                color: white

            a
                color: white

                .element
                    width: vw(160)
                    height: auto

                    .line-dark
                        width: vw(160)
                        height: vw(220)

                    .line
                        width: vw(160)
                        height: vw(150)
                        background-color: rgba(30, 155, 177, 0.8)
                        display: flex
                        flex-direction: column
                        justify-content: flex-end
                        text-align: center

                        .chinese
                            height: vw(70)
                            font-size: vw(26)
                            display: flex
                            flex-direction: column
                            justify-content: center

                        .english
                            height: vw(70)
                            font-size: vw(16)
                            transform: scale(0.6)

                .xiongxing-jisu-tuofa
                    background-image: url("images/news/xiongxing-jisu-tuofa.png")
                    background-size: 100% 100%
                    background-position: center center

                .chanhou-tuofa
                    background-image: url("images/news/chanhou-tuofa.png")
                    background-size: 100% 100%
                    background-position: center center

                .huaxuexing-tuofa
                    background-image: url("images/news/huaxuexing-tuofa.png")
                    background-size: 100% 100%
                    background-position: center center

                .jingshenxing-tuofa
                    background-image: url("images/news/jingshenxing-tuofa.png")
                    background-size: 100% 100%
                    background-position: center center

                .zhiyixing-tuofa
                    background-image: url("images/news/zhiyixing-tuofa.png")
                    background-size: 100% 100%
                    background-position: center center

                .yichuanxing-tuofa
                    background-image: url("images/news/yichuanxing-tuofa.png")
                    background-size: 100% 100%
                    background-position: center center

                .bantu
                    background-image: url("images/news/bantu.png")
                    background-size: 100% 100%
                    background-position: center center

                .wulixing-tuofa
                    background-image: url("images/news/wulixing-tuofa.png")
                    background-size: 100% 100%
                    background-position: center center

#common-solution-container
    width: vw(750)
    height: auto

    .swiper-wrapper
        width: vw(750)
        height: auto

        .swiper-slide
            width: vw(700)
            height: auto
            display: flex
            justify-content: center

            .content-box
                width: vw(700)
                height: vw(660)

                .element
                    width: auto
                    height: vw(200)
                    display: flex
                    justify-content: space-between
                    align-items: center

                    .img
                        width: vw(200)
                        height: vw(200)

                    .article-box
                        width: vw(480)
                        height: vw(200)
                        display: flex
                        flex-direction: column
                        justify-content: flex-start
                        color: $content_color

                        .line
                            font-size: vw(24)
                            line-height: vw(40)

                            .label
                                font-size: vw(26)
                                font-weight: bold
                                color: $title_color

.pagination-container
    width: vw(750)
    height: auto
    display: flex
    flex-direction: column
    justify-content: center
    align-items: center

    .swiper-pagination-bullet
        width: vw(12)
        height: vw(12)
        border-radius: vw(12)
        margin: 0 vw(4)
        background-color: $brand_main_color

#case-container
    width: vw(750)
    height: auto

    .swiper-wrapper
        width: vw(750)
        height: auto

        .swiper-slide
            width: vw(700)
            height: auto
            display: flex
            justify-content: center

            .content-box
                width: vw(700)
                height: auto
                display: flex
                flex-direction: column
                justify-content: center

                .img
                    width: vw(700)
                    height: vw(300)

                .content-box
                    width: vw(700)
                    height: auto
                    color: $content_color
                    text-indent: 2em
                    font-size: vw(22)
                    line-height: vw(44)
                    word-break: break-all
